<template>
  <div>
    <input type="text"
           placeholder="请输入任务名称"
           v-model="value"
           @keydown.enter="enter"
    />
  </div>
</template>

<script setup>
import {ref} from 'vue'

const emit = defineEmits(['add'])

let value = ref('')
// 按回车建确认
const enter = () => {
  // 把输入框的内容传递给父组件
  emit('add', value.value)
  // 清空输入框
  value.value = ''
}
</script>

<style scoped lang="scss">
input {
  margin-bottom: 10px;
}
</style>